<template>
  <div class="foot">
    <div class="top">
      <div class="box box1">
        <div class="title">
          <span>售前咨询</span>
          <p class="hr"></p>
        </div>
        <div class="tell">0371-60608666</div>
        <div class="mail">tbmos@crectbm.com</div>
      </div>
      <div class="box">
        <div class="title">支持与服务</div>
        <div class="cont">
          <p class="span"
             @click="to(0)">关于我们</p>
          <p class="span"
             @click="to(2)">卖家入口</p>
          <p class="span"
             @click="to(1)">买家入口</p>
          <p class="span"
             @click="to(3)">线下支付信息</p>
          <p class="span"
             @click="to(4)">客服投诉</p>
        </div>
      </div>
      <div class="box">
        <div class="title">用户指南</div>
        <div class="cont">
          <p class="span"
             @click="kink(0)">买家中心</p>
          <p class="span"
             @click="kink(1)">发布需求</p>
          <p class="span"
             @click="kink(2)">我的订单</p>
          <p class="span"
             @click="kink(3)">发票索取</p>
        </div>
      </div>
      <div class="box">
        <div class="title">服务商指南</div>
        <div class="cont">
          <p class="span"
             @click="golink1(0)">入驻流程</p>
          <p class="span"
             @click="golink1(1)">卖家中心</p>
          <p class="span"
             @click="golink1(2)">发布商品</p>
          <p class="span"
             @click="golink1(3)">结算管理</p>
          <p class="span"
             @click="golink1(4)">订单管理</p>
        </div>
      </div>
      <div class="box">
        <div class="title">快速链接</div>
        <div class="cont">
          <a class="span"
             :href="link1"
             target=_blank>工业互联网平台</a>
          <a class="span"
             :href="link2"
             target=_blank>盾构大脑</a>
          <p class="span"
             @click="golink2(2)">供需大厅</p>
          <a class="span"
             :href="link3"
             target=_blank>社区</a>
          <a class="span"
             href="https://www.crectbm.com"
             target=_blank>中铁工程装备集团</a>
        </div>
      </div>
      <div class="box box5">
        <div class="title">关注我们</div>
        <img src="@/assets/img/code.jpg"
             class="code" />
      </div>
    </div>
    <div class="bottom">蜀ICP备15015009号中铁工程装备集团有限公司版权所有</div>
  </div>
</template>

<script>

export default {
  name: "",
  data() {
    return {
      list: ['关于我们', '买家入门', '卖家入门', '线下支付账号信息', '客服投诉'],
      ind: 0,
      html: '<p>123456</p>',
      link1: "",
      link2: "",
      link3: ""
    };
  },
  //注册组件
  components: {},
  //生命周期 - 创建完成（访问当前this实例）
  created() {
    // /api/cms/getLinkUrl

  },
  //生命周期 - 挂载完成（访问DOM元素）
  mounted() {
    this.link1 = this.$urlpc;
    this.getlinks();
  },
  //计算属性
  computed: {},
  //方法
  methods: {
    async getLinkUrl(status) {
      let res = await this.$postRequest('/api/cms/getLinkUrl', { status })
      return res.data.linkUrl
    },
    to(i) {
      this.$router.push({ name: "service", params: { index: i } });
    },
    kink(i) {
      if (!localStorage.getItem('userId')) {
        this.$router.push({ name: 'loginindex', params: { name: i == 0 ? 'yindex' : i == 1 ? 'release' : i == 2 ? 'yorder' : '' } })
      } else if (i == 0) {
        this.$router.push({ name: 'yindex' })
      } else if (i == 1) {
        this.$router.push({ name: 'release' })
      } else if (i == 2) {
        this.$router.push({ name: 'yorder' })
      } else if (i == 3) {
        this.$router.push({ name: 'invoice' })
      }
    },
    golink1(i) {
      if (i == 0) {
        this.$router.push({ name: 'guide' })
      } else if (i == 1) {
        // console.log(i, this.$urlpc + 'comlist')
        window.open(this.$urlgw)
      } else if (i == 2) {
        window.open(this.$urlgw + 'comlist')
      } else if (i == 3) {
        window.open(this.$urlgw + 'order')
      } else if (i == 4) {
        window.open(this.$urlgw + 'order')
        // this.$router.push({ name: 'order' })
      }
    },
    // 获取所有链接
    getlinks() {
      this.getLinkUrl('0').then(res => {
        this.link2 = res;
      })
      this.getLinkUrl('1').then(res => {
        this.link3 = res;
      })
    },
    golink2(i) {
      if (i == 2) {
        this.$router.push({ name: 'demand' })
      }
    }
  }
};
</script>
<style scoped lang="scss">
a {
  color: inherit;
  text-decoration: none;
  display: block;
  border: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -moz-user-focus: none;
}
.foot {
  background: #1f232a;
  // padding: 0 2%;
  .top {
    height: 320px;
    display: flex;
    justify-content: space-between;
    width: 1400px;
    margin: 0 auto;
    .box {
      // width: 20%;
      .title {
        font-size: 16px;
        font-family: Microsoft YaHei UI;
        color: #ffffff;
        letter-spacing: 1px;
        margin-top: 50px;
        .hr {
          width: 30px;
          height: 2px;
          background: #1a69e0;
          margin-top: 10px;
        }
      }
      .cont {
        font-size: 12px;
        font-family: Microsoft YaHei UI;
        color: #e7e9ec;
        margin-top: 45px;
        .span {
          cursor: pointer;
          display: block;
          margin-bottom: 22px;
        }
        .span:hover {
          color: #1a69e0;
        }
      }
    }
    .box1 {
      .tell {
        font-size: 24px;
        font-family: Arial;
        color: #e7e9ec;
        margin-top: 37px;
      }
      .mail {
        font-size: 14px;
        font-family: Microsoft YaHei UI;
        color: #ffffff;
        margin-top: 30px;
      }
    }
    .box5 {
      .code {
        height: 117px;
        width: 117px;
        margin-top: 50px;
      }
    }
  }
  .bottom {
    font-size: 12px;
    font-family: PingFang SC;
    color: #ffffff;
    text-align: center;
    line-height: 40px;
    min-width: 1400px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin: 0 auto;
    position: relative;
    // &::after {
    //   content: "";
    //   position: absolute;
    //   width: 100vw;
    //   height: 1px;
    //   top: 0;
    //   left: 0;
    //   background: rgba(255, 255, 255, 0.1);
    // }
  }
}
</style>